<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="../css/cart.css">
  <script src="../libs/requirejs/require.min.js" data-main="../js/cart"></script>
</head>
<body>
    <a href="../index.html"><div class="logo"></div></a>
  <table border="1">
    <thead>
      <tr>
        <th class="text"><input type="checkbox" class="all">全选</th>
        <th class="text1">商品编号</th>
        <th class="text2">商品图片</th>
        <th class="text3">商品标题</th>
        <th class="text4">商品价格</th>
        <th class="text5">选购数量</th>
        <th class="text6">小计</th>
        <th class="text7">操作</th>
      </tr>
    </thead>
    <tbody class="cart-body">
      
    </tbody>
    <tfoot>
      <tr>
        <td colspan="8" >
          <div class="foot">
            <a href="../index.html"><div class="bt">继续购物</div></a>
            <div class="bt clear">清空购物车</div>
            <div class="zj">总计 ( 不含运费 ) : ￥</div>
            <div class="total"></div>
            <a href="#" class="test"><div class="bt1">去结算</div></a>
          </div>
        </td>
      </tr>
    </tfoot>
  </table> 

  <!-- 定义购物车中商品行的模板 -->
  <script type="text/html" id="cart-template">
    {{if cart.length === 0}}
      <tr>
        <td colspan="7">购物车为空，请<a href="/">选购商品</a></td>
      </tr>
    {{else}}
      {{each cart}}
      <tr data-id="{{$value.id}}">
        <td  class="text" style="text-align: center;"><input type="checkbox"></td>
        <td  class="text1">{{$value.id}}</td>
        <td class="text2"><img src="{{$value.image}}" style="width: 64px; height: 64px;"></td>
        <td class="text3">{{$value.title}}</td>
        <td class="text4">{{$value.price}}</td>
        <td class="text5">
          <div class="min-plus">
            <button class="minus">-</button>
            <span class="amount">{{$value.amount}}</span>
            <button class="plus">+</button>
          </div>
        </td>
        <td class="sub text6">{{$value.price * $value.amount}}</td>
        <td  class="text7"><button class="del">删除</button></td>
      </tr>
      {{/each}}
    {{/if}}
  </script>
</body>
</html>